<template>
	<view>
		<view class="bigbox">
			<view class="box">历史选座详情</view>
			<view class="box-two">
				预约时间：
				<view class="box-one">
					{{time}}
				</view>
			</view>
			<view class="box-two">
				确认座位时间：
				<view class="box-one">
					{{sure_time}}
				</view>
			</view>
			<view class="box-two">
				图书馆名称：
				<view class="box-one">
					{{tusg}}
				</view>
			</view>
			<view class="box-two">
				座位：
				<view class="box-one">
					{{zuowei}}
				</view>
			</view>
			<view class="qcode">
				<canvas id="qrcode" canvas-id="qrcode" style="width: 225px;height: 225px;" />
				<view class="qcode_box">
					二维码详情
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import uQRCode from '../../../components/uqrcode/common/uqrcode.js';
	export default {
		data() {
			return {
					time:"2022-02-25 13:23:23",
					sure_time:"2022-01-31 20:00:00",
					zuowei:"2F-11",
					tusg:"笑嘻嘻图书馆1层"
			}
		},
		methods: {
			onReady() {
				uQRCode
					.make({
						canvasId: 'qrcode',
						componentInstance: this,
						size: 225,
						margin: 10,
						text: 'uQRCode',
						backgroundColor: '#ffffff',
						foregroundColor: '#000000',
						fileType: 'png',
						errorCorrectLevel: uQRCode.errorCorrectLevel.H
					})
					.then(res => {
						console.log(res);
					});
			
			},
			HistoryInit(id){
				uni.$u.http
					.post('/app/appoint/getAppoint/'+id)
					.then(res => {
						console.log(res.data);
						this.time = res.data.accuracyTime,
						this.sure_time = res.data.overTime,
						this.tusg = res.data.libraryName +"-"+res.data.areaName,
						this.zuowei = res.data.seatName +'号'
					})
					.catch(err => {});
			}
		},
		onLoad(params) {
			console.log(params.id);
			this.HistoryInit(params.id)
		}
	}
</script>

<style>
	.bigbox{
		margin: 50rpx ;
		margin-left: 3%;
	}
	.box-one{
		display: inline-block;
		position: fixed;
		right: 20rpx;
		color: #000000;
	}
	.box{
		width: 100%;
		margin-left: 36%;
		margin-top: 1%;
		margin-bottom: 30rpx;
		font-size: 38rpx;
	}
	
	.box-two{
		color: #c7c7c7;
		margin: 2% 0;
	}
	
	canvas{
		display: inline-block;
		margin-left: 20%;
		margin-top: 10%;
	}
	
	.qcode_box{
		color: #c7c7c7;
		margin-left: 38%;
	}
	
	.qcode{
		margin-top: 10%;
	}
</style>
